<script type="text/javascript" src="../../assets/js/core/libraries/jquery_ui/sliders.min.js"></script>
<script type="text/javascript" src="../../assets/js/core/libraries/jquery_ui/interactions.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/forms/styling/switchery.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/forms/styling/switch.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/forms/styling/uniform.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/forms/selects/select2.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/forms/selects/bootstrap_multiselect.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/forms/selects/selectboxit.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/forms/selects/bootstrap_select.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/forms/inputs/touchspin.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/sliders/nouislider.min.js"></script>
<script type="text/javascript" src="../../assets/js/core/libraries/jquery_ui/sliders.min.js"></script>
<script type="text/javascript" src="../../assets/js/core/libraries/jquery_ui/touch.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/sliders/slider_pips.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/sliders/nouislider.min.js"></script>
<script type="text/javascript" src="../../assets/js/plugins/sliders/touch_punch.min.js"></script>


<script type="text/javascript" src="../../assets/js/core/app.js"></script>
<script type="text/javascript" src="../../assets/js/pages/components_sliders.js"></script>
<script type="text/javascript" src="../../assets/js/pages/appearance_panel_heading.js"></script>
<!-- /theme JS files -->


<!-- Main navbar -->
<div class="navbar navbar-inverse">
    <div class="navbar-header">
        <!-- 这里是左上方的那个图片 -->
      <!--  <a class="navbar-brand" href=""><img src="" alt=""></a>-->

        <ul class="nav navbar-nav pull-right visible-xs-block">
            <li><a data-toggle="collapse" data-target="#navbar-mobile"><i class="icon-tree5"></i></a></li>
            <li><a class="sidebar-mobile-main-toggle"><i class="icon-paragraph-justify3"></i></a></li>
        </ul>
    </div>

    <div class="navbar-collapse collapse" id="navbar-mobile">
        <ul class="nav navbar-nav">
            <li>
                <a class="sidebar-control sidebar-main-toggle hidden-xs">
                    <i class="icon-paragraph-justify3"></i>
                </a>
            </li>

            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    <i class="icon-git-compare"></i>
                    <span class="visible-xs-inline-block position-right">Git updates</span>
                    <span class="badge bg-warning-400">9</span>
                </a>

                <div class="dropdown-menu dropdown-content">
                    <div class="dropdown-content-heading">
                        Git updates
                        <ul class="icons-list">
                            <li><a href="#"><i class="icon-sync"></i></a></li>
                        </ul>
                    </div>

                    <ul class="media-list dropdown-content-body width-350">
                        <li class="media">
                            <div class="media-left">
                                <a href="#" class="btn border-primary text-primary btn-flat btn-rounded btn-icon btn-sm"><i class="icon-git-pull-request"></i></a>
                            </div>

                            <div class="media-body">
                                Drop the IE <a href="#">specific hacks</a> for temporal inputs
                                <div class="media-annotation">4 minutes ago</div>
                            </div>
                        </li>

                        <li class="media">
                            <div class="media-left">
                                <a href="#" class="btn border-warning text-warning btn-flat btn-rounded btn-icon btn-sm"><i class="icon-git-commit"></i></a>
                            </div>

                            <div class="media-body">
                                Add full font overrides for popovers and tooltips
                                <div class="media-annotation">36 minutes ago</div>
                            </div>
                        </li>

                        <li class="media">
                            <div class="media-left">
                                <a href="#" class="btn border-info text-info btn-flat btn-rounded btn-icon btn-sm"><i class="icon-git-branch"></i></a>
                            </div>

                            <div class="media-body">
                                <a href="#">Chris Arney</a> created a new <span class="text-semibold">Design</span> branch
                                <div class="media-annotation">2 hours ago</div>
                            </div>
                        </li>

                        <li class="media">
                            <div class="media-left">
                                <a href="#" class="btn border-success text-success btn-flat btn-rounded btn-icon btn-sm"><i class="icon-git-merge"></i></a>
                            </div>

                            <div class="media-body">
                                <a href="#">Eugene Kopyov</a> merged <span class="text-semibold">Master</span> and <span class="text-semibold">Dev</span> branches
                                <div class="media-annotation">Dec 18, 18:36</div>
                            </div>
                        </li>

                        <li class="media">
                            <div class="media-left">
                                <a href="#" class="btn border-primary text-primary btn-flat btn-rounded btn-icon btn-sm"><i class="icon-git-pull-request"></i></a>
                            </div>

                            <div class="media-body">
                                Have Carousel ignore keyboard events
                                <div class="media-annotation">Dec 12, 05:46</div>
                            </div>
                        </li>
                    </ul>

                    <div class="dropdown-content-footer">
                        <a href="#" data-popup="tooltip" title="All activity"><i class="icon-menu display-block"></i></a>
                    </div>
                </div>
            </li>
        </ul>

        <ul class="nav navbar-nav navbar-right">
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    <i class="icon-people"></i>
                    <span class="visible-xs-inline-block position-right">Users</span>
                </a>

                <div class="dropdown-menu dropdown-content">
                    <div class="dropdown-content-heading">
                        Users online
                        <ul class="icons-list">
                            <li><a href="#"><i class="icon-gear"></i></a></li>
                        </ul>
                    </div>

                    <ul class="media-list dropdown-content-body width-300">
                        <li class="media">
                            <div class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="#" class="media-heading text-semibold">Jordana Ansley</a>
                                <span class="display-block text-muted text-size-small">Lead web developer</span>
                            </div>
                            <div class="media-right media-middle"><span class="status-mark border-success"></span></div>
                        </li>

                        <li class="media">
                            <div class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="#" class="media-heading text-semibold">Will Brason</a>
                                <span class="display-block text-muted text-size-small">Marketing manager</span>
                            </div>
                            <div class="media-right media-middle"><span class="status-mark border-danger"></span></div>
                        </li>

                        <li class="media">
                            <div class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="#" class="media-heading text-semibold">Hanna Walden</a>
                                <span class="display-block text-muted text-size-small">Project manager</span>
                            </div>
                            <div class="media-right media-middle"><span class="status-mark border-success"></span></div>
                        </li>

                        <li class="media">
                            <div class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="#" class="media-heading text-semibold">Dori Laperriere</a>
                                <span class="display-block text-muted text-size-small">Business developer</span>
                            </div>
                            <div class="media-right media-middle"><span class="status-mark border-warning-300"></span></div>
                        </li>

                        <li class="media">
                            <div class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="#" class="media-heading text-semibold">Vanessa Aurelius</a>
                                <span class="display-block text-muted text-size-small">UX expert</span>
                            </div>
                            <div class="media-right media-middle"><span class="status-mark border-grey-400"></span></div>
                        </li>
                    </ul>

                    <div class="dropdown-content-footer">
                        <a href="#" data-popup="tooltip" title="All users"><i class="icon-menu display-block"></i></a>
                    </div>
                </div>
            </li>

            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    <i class="icon-bubbles4"></i>
                    <span class="visible-xs-inline-block position-right">Messages</span>
                    <span class="badge bg-warning-400">2</span>
                </a>

                <div class="dropdown-menu dropdown-content width-350">
                    <div class="dropdown-content-heading">
                        Messages
                        <ul class="icons-list">
                            <li><a href="#"><i class="icon-compose"></i></a></li>
                        </ul>
                    </div>

                    <ul class="media-list dropdown-content-body">
                        <li class="media">
                            <div class="media-left">
                                <img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt="">
                                <span class="badge bg-danger-400 media-badge">5</span>
                            </div>

                            <div class="media-body">
                                <a href="#" class="media-heading">
                                    <span class="text-semibold">James Alexander</span>
                                    <span class="media-annotation pull-right">04:58</span>
                                </a>

                                <span class="text-muted">who knows, maybe that would be the best thing for me...</span>
                            </div>
                        </li>

                        <li class="media">
                            <div class="media-left">
                                <img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt="">
                                <span class="badge bg-danger-400 media-badge">4</span>
                            </div>

                            <div class="media-body">
                                <a href="#" class="media-heading">
                                    <span class="text-semibold">Margo Baker</span>
                                    <span class="media-annotation pull-right">12:16</span>
                                </a>

                                <span class="text-muted">That was something he was unable to do because...</span>
                            </div>
                        </li>

                        <li class="media">
                            <div class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="#" class="media-heading">
                                    <span class="text-semibold" ng-bind="user.accountName">{{user.accountName}}</span>
                                    <span class="media-annotation pull-right">22:48</span>
                                </a>

                                <span class="text-muted">But that would be extremely strained and suspicious...</span>
                            </div>
                        </li>

                        <li class="media">
                            <div class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="#" class="media-heading">
                                    <span class="text-semibold">Beatrix Diaz</span>
                                    <span class="media-annotation pull-right">Tue</span>
                                </a>

                                <span class="text-muted">What a strenuous career it is that I've chosen...</span>
                            </div>
                        </li>

                        <li class="media">
                            <div class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="#" class="media-heading">
                                    <span class="text-semibold">Richard Vango</span>
                                    <span class="media-annotation pull-right">Mon</span>
                                </a>

                                <span class="text-muted">Other travelling salesmen live a life of luxury...</span>
                            </div>
                        </li>
                    </ul>

                    <div class="dropdown-content-footer">
                        <a href="#" data-popup="tooltip" title="All messages"><i class="icon-menu display-block"></i></a>
                    </div>
                </div>
            </li>

            <li class="dropdown dropdown-user">
                <a class="dropdown-toggle" data-toggle="dropdown">
                    <img src="../../assets/images/placeholder.jpg" alt="">
                    <span ng-bind="user.accountName">{{user.accountName}}</span>
                    <i class="caret"></i>
                </a>

                <ul class="dropdown-menu dropdown-menu-right">
                    <li><a href="#"><i class="icon-user-plus"></i> My profile</a></li>
                    <li><a href="#"><i class="icon-coins"></i> My balance</a></li>
                    <li><a href="#"><span class="badge badge-warning pull-right">58</span> <i class="icon-comment-discussion"></i> Messages</a></li>
                    <li class="divider"></li>
                    <li><a href="#"><i class="icon-cog5"></i> Account settings</a></li>
                    <li><a href="#"><i class="icon-switch2"></i> Logout</a></li>
                </ul>
            </li>
        </ul>
    </div>
</div>
<!-- /main navbar -->

<div class="page-container">

    <!-- Page content -->

    <div class="page-content">

        <!-- Main sidebar -->

        <div class="sidebar sidebar-main">
            <div class="sidebar-content">

                <!-- User menu -->
                <div class="sidebar-user">
                    <div class="category-content">
                        <div class="media">
                            <a href="#" class="media-left"><img src="../../assets/images/placeholder.jpg" class="img-circle img-sm" alt=""></a>
                            <div class="media-body">
                                <span class="media-heading text-semibold" ng-bind="user.accountName">{{user.accountName}}</span>
                                <div class="text-size-mini text-muted" ng-click=" goToEditPage()">
                                    编辑信息
                                </div>
                            </div>

                            <div class="media-right media-middle">
                                <ul class="icons-list">
                                    <li>
                                        <a href="#"><i class="icon-cog3"></i></a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /user menu -->


                <!-- Main navigation -->
                <div class="sidebar-category sidebar-category-visible">
                    <div class="category-content no-padding">
                        <ul class="navigation navigation-main navigation-accordion">
                            <!-- Main -->
                            <li class="navigation-header"><span>Main</span> <i class="icon-menu" title="Main pages"></i></li>
                            <li><a href=""><i class="icon-home4"></i>学校：<span ng-bind="user.university">{{user.university}}</span></a></li>
                            <li><a href=""><i class="icon-people"></i>年龄：<span ng-bind="user.age">{{user.age}}</span></a></li>
                            <li>
                                <a href="#"><i class="icon-stack2"></i>专业： <span ng-bind="user.major">{{user.major}}</span></a>

                            </li>


                            <li>
                                <a href="#"><i class="icon-copy"></i> 年级：<span ng-bind="user.grade">{{user.grade}}</span></a>
                            </li>

                            <li><a href=""><i class="icon-list-unordered"></i> 电话：<span ng-bind="user.phoneNumber">{{user.phoneNumber}}</span></a></li>
                            <!-- /main -->

                            <!-- other -->
                            <li class="navigation-header"><span>Other</span> <i class="icon-menu" title="Other"></i>
                            </li>

                            <li>
                                <a href="#"><i class="icon-copy"></i> 专业：<span ng-bind="user.major">{{user.major}}</span></a>
                            </li>

                            <li>
                                <a href="#"><i class="icon-copy"></i> 摄影风格 ：<span>物影照片</span></a>
                                <!--
                                <ul>
                                    <li><a href="#">高艺术摄影</a></li>
                                    <li><a href="#">纯粹派摄影</a></li>
                                    <li><a href="#">主观摄影</a></li>
                                    <li><a href="#">其他艺术摄影</a></li>
                                </ul>
                                -->
                            </li>

                            <li>
                                <a href="#"><i class="icon-copy"></i> 性格：<span>稳重</span></a>
                            </li>
                            <!-- /other -->

                        </ul>
                    </div>
                </div>
                <!-- /main navigation -->

            </div>
        </div>
        <!-- /main sidebar -->



        <!-- Main content -->
        <div class="content-wrapper">

            <!-- Page header -->
            <div class="page-header">
                <div class="page-header-content">
                    <div class="page-title">
                        <h4><i class="icon-arrow-left52 position-left" ng-click="returnPhotoStart()"></i> <span class="text-semibold" ng-click="returnPhotoStart()">首页</span> - 个人中心</h4>
                    </div>

                </div>

                <div class="breadcrumb-line">
                    <ul class="breadcrumb">
                        <li><a href="photoStart"><i class="icon-home2 position-left"></i> Home</a></li>
                        <!--<li><a href="form_inputs_basic.html">Forms</a></li>-->
                        <li class="active">Basic inputs</li>
                    </ul>

                    <ul class="breadcrumb-elements">
                        <li><a href="#"><i class="icon-comment-discussion position-left"></i> Support</a></li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="icon-gear position-left"></i>
                                Settings
                                <span class="caret"></span>
                            </a>

                            <ul class="dropdown-menu dropdown-menu-right">
                                <li><a href="#"><i class="icon-user-lock"></i> Account security</a></li>
                                <li><a href="#"><i class="icon-statistics"></i> Analytics</a></li>
                                <li><a href="#"><i class="icon-accessibility"></i> Accessibility</a></li>
                                <li class="divider"></li>
                                <li><a href="#"><i class="icon-gear"></i> All settings</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
            <!-- /page header -->


            <!-- Content area -->
            <div class="content">

                <!-- Form horizontal -->
                <div class="panel panel-flat">
                    <div class="panel-heading">
                        <h5 class="panel-title">Basic Informations</h5>
                        <div class="heading-elements">
                            <ul class="icons-list">
                                <li><a data-action="collapse"></a></li>
                                <li><a data-action="reload"></a></li>
                                <li><a data-action="close"></a></li>
                            </ul>
                        </div>
                    </div>


                    <div class="panel-body">

                        <form class="form-horizontal" action="#">

                            <fieldset class="content-group">
                                <!--<legend class="text-bold">Basic inputs</legend>-->

                                <div class="panel panel-body border-top-danger">

                                    <div class="text-center">
                                        <h6 class="no-margin text-semibold">资料完整程度 </h6>
                                        <p class="content-group-sm text-muted" ng-click="goToEditPage()"><code>继续完善</code></p>
                                    </div>

                                    <!--<div class="noui-slider-connect-lower noui-slider-info"></div>-->
                                    <div class="progress progress-striped">
                                        <div class="progress-bar progress-bar-success" role="progressbar"
                                             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                                             style="width: 60%;">
                                            <span class="sr-only">60% 完成</span>
                                        </div>
                                    </div>
                                    <!-- progress bar -->

                                </div>

                                <div class="panel panel-body border-top-primary">
                                    <div class="text-center">
                                        <h6 class="no-margin text-semibold">您的权限等级</h6>
                                        <p class="content-group-sm text-muted">等级：0.0-- <code>较低</code>--1.0--<code>一般</code>--2.0--<code>良好</code>--3.0--<code>优秀</code></p>
                                    </div>


                                   <!-- <div class="ui-slider-suffix-prefix"></div>-->

                                    <div class="panel-body border-top-white">
                                    <div class="text-center">
                                        <div>

                                            <div> -----------------------------------</div>
                                            <div>
                                                <i class="icon-camera"></i> 照片数量：<span>100</span>
                                            </div>
                                            <div> -----------------------------------</div>
                                            <div>
                                                <i class="icon-heart"></i> 好评指数：<span>80%</span>
                                            </div>
                                            <div> -----------------------------------</div>
                                            <div>
                                                <i class="icon-star"></i> 信用评级：<span> 8/10</span>
                                            </div>
                                            <div> -----------------------------------</div>

                                        </div>

                                        <!--
                                            <div class="ui-slider-vertical-range-min full-width">
                                                <span class="ui-slider-primary">70</span>
                                                <span class="ui-slider-success">52</span>
                                                <span class="ui-slider-warning">80</span>
                                                <span class="ui-slider-info">34</span>
                                            </div>
                                            -->
                                    </div>
                                    </div>

                                    <div class="text-center">

                                    </div>
                                </div>




                            </fieldset>


                        </form>
                    </div>
                </div>
                <!-- /form horizontal -->


                <!-- Footer -->
                <div class="footer text-muted">
                    &copy; 2018. <a href="#">Aperture</a> by <a href="http://themeforest.net/user/Kopyov" target="_blank">software team</a>
                </div>
                <!-- /footer -->

            </div>
            <!-- /content area -->

        </div>
        <!-- /main content -->
    </div>

    <!-- /page content -->

</div>
<!-- /page container -->



